<template>
  <div>
    <h1 class="header">我是头部组件</h1>
    <!-- <h1>{{ person }}</h1> -->
    <h1>{{name}}{{age}}{{sex}}</h1>
    
    <button @click="showprops">点击获取props</button>
  </div>
</template>

<script>
export default {
  name: "Header",
  props: ["name","age","sex"],
  data() {
    return {};
  },
  methods: {
    showprops() {
      console.log(this, "this");
      console.log(this._props, "this._props");
      console.log(this.person, "this.person");
    },
  },
};
</script>

<style scoped>
.header {
  width: 300px;
  height: 100px;
  text-align: center;
  line-height: 100px;
  background: green;
}
</style>